.page-item-list-category {
  .goods-item__bd {
    display: block !important;
  }
  // background: $color-bg-gray;
  &.has-navbar {
    .search-wrap {
      top: $navigate-height;
    }
  }
  .sp-page-body {
    padding-top: $navigate-height;
  }

  .main_category {
    background-color: #f5f5f5;
    padding: 20px;
    display: flex;
    align-items: center;
    width: 100%;
    overflow-x: scroll;

    &-item {
      padding: 10px;
      border-radius: 20px;
      background-color: #fff;
      margin-right: 10px;
      text-align: center;

      &-img {
        width: 140px;
        border-radius: 20px;
        height: 140px;
        margin-bottom: 10px;
        text-align: center;
      }
      &-name {
        text-align: center;
        width: 5em;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
      }
    }
    &-actv {
      color: #fff;
      background-color: var(--color-primary);
    }
  }

  .item-list-head {
    background: #fff;
    // position: fixed;
    // left: 0;
    // top: 0;
    // /*  #ifdef  h5  */
    // top: $navigate-height;
    // /*  #endif  */
    // z-index: 999;
    // width: 100%;
  }

  .search-wrap {
    padding: 16px 28px;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    background: #fff;
    z-index: 1000;
    display: flex;
    align-items: center;

    .store-picker {
      display: flex;
      align-items: center;
      margin-right: 16px;

      .shop-name {
        margin-right: 6px;
      }
    }

    .search-input {
      flex: 1;
    }
  }

  .sp-filter-bar {
    &__item {
      background: #f5f5f5;

      &:first-child {
        border-top-left-radius: 40px;
      }

      &:last-child {
        border-top-right-radius: 40px;
      }
    }
  }

  &.has-tagbar {
    .item-list-scroll {
      // /*  #ifdef h5 */
      // @include page-scroll($searchbar-height + $navigate-height + 16 * 2 + $tabs-height * 2+10, 0);
      // /*  #endif  */
    }
  }

  .item-list-scroll {
    // @include page-scroll($tabs-height + $navigate-height + 10, 0);
    // /*  #ifdef  h5  */
    // @include page-scroll($searchbar-height + $navigate-height + 16 * 2 + $tabs-height + 10, 0);
    // /*  #endif  */
  }

  .filter-btn {
    font-size: 28px;
    color: var(--color-primary);
    position: relative;
    text-align: text;
    float: right;

    &:before {
      content: '';
      display: block;
      height: 40px;
      /* prettier-ignore */
      width: 1PX;
      background: #f5f5f5;
      position: absolute;
      left: -30px;
    }

    .icon-filter {
      font-size: 30px;
    }
  }

  .goods-list {
    display: flex;
    justify-content: space-between;
    padding: 0 16px;

    .goods-list-wrap {
      width: 345px;
      margin-bottom: 28px;
    }

    .left-container {
      width: 350px;
    }

    .right-container {
      width: 350px;
      // padding-left: 20px;
    }

    .goods-item-wrap {
      margin-bottom: 20px;
      // box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.1);
      border-radius: 2px;
    }

    .sp-goods-item {
      border-radius: 16px;
      overflow: hidden;
    }
  }

  // .goods-tabs {
  //   background: #fff;
  //   .sp-filter-bar__item {
  //     border-radius: 0;
  //     background: #f5f5f5;
  //     &:first-child {
  //       border-radius: 50px 0 0 0;
  //     }
  //     &:last-child {
  //       border-radius: 0 50px 0 0;
  //     }
  //   }
  // }

  // .tag-block {
  //   padding: 0 20px 16px;
  //   display: flex;
  //   align-items: center;
  //   background: #fff;
  //   .tag-container {
  //     flex: 1;
  //   }
  //   .filter-btn {
  //     width: 100px;
  //     display: flex;
  //     align-items: center;
  //     .filter-text {
  //       color: var(--color-primary);
  //     }
  //     .icon-shaixuan-01 {
  //       color: var(--color-primary);
  //       font-size: 32px;
  //       position: relative;
  //       top: 2px;
  //     }
  //   }
  // }

  .brand-title {
    font-size: 32px;
    font-weight: 600;
    color: #111;
    margin-bottom: 20px;
  }

  .wgt-store {
    margin-bottom: 16px;

    .store-wrap {
      margin: 24px 16px 0;
      padding: 24px 16px;
      background: #ffffff;
      // box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
      border-radius: 16px;

      .store-info {
        display: flex;
        align-items: center;

        .store-logo {
          width: 100px;
          height: 100px;
          border-radius: 15px;
          border: 3px solid #ffffff;
          background: #dddddd;
          overflow: hidden;
          box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
        }

        .store-title {
          padding-left: 24px;
          width: 80%;

          .store-name {
            font-size: 30px;
            font-weight: 600;
            color: #111;
            @include multi-ellipsis(1);
          }

          .store-tags {
            margin-top: 6px;

            &-item {
              margin-right: 10px;
              color: var(--color-primary);
              border: 1px solid var(--color-primary);
              padding: 0px 11px;
              border-radius: 8px;
              line-height: 32px;
              font-size: 22px;
            }
          }
        }
      }

      .store-banner {
        width: 100%;
        margin-top: 24px;
        display: block;
        border-radius: 16px;
        overflow: hidden;
      }

      .store-goods {
        white-space: nowrap;
        margin-top: 20px;

        :last-child {
          margin-right: 0px;
        }

        &__item {
          display: inline-block;
          margin-right: 16px;

          &-thumbnail {
            width: 218px;
            height: 218px;
            border-radius: 16px;
            overflow: hidden;
          }

          &-price {
            line-height: 33px;
            font-size: 32px;
            margin-top: 10px;

            // color: var(--color-primary);
            .cur {
              font-size: 24px;
              margin-right: 10px;
            }
          }
        }
      }
    }
  }
}
